<template>
  <div style="width: 100%">
  <a-alert style="margin-bottom:20px;"  message="温馨提示：导入数据前，检查导入的文件格式是否和提供的数据模板一致。若您还没有下载模板，请点击模板下载" banner />
  <a-card :bordered="false">
      <a-row :gutter="48">
        <a-col :sm="{span:16}" :xl="{span:16}">
          <div>
            <a-upload
              :fileList="fileList"
              :remove="handleRemove"
              :beforeUpload="beforeUpload"
            >
              <a-button type="primary" >选择文件</a-button>
              <a-button
                type="primary"
                @click.stop="handleImport"
                :disabled="fileList.length === 0"
                :loading="uploading"
              >
                {{uploading ? 'Uploading' : '导入' }}
              </a-button>
            </a-upload>
          </div>
          </a-col>
          <a-col :sm="{span:8}" :xl="{span:8}" style="text-align:right">
            <a-button type="primary" @click="handleDownLoad">模版下载</a-button>
          </a-col>
      </a-row>
  </a-card>
  </div>
</template>

<script>
// import moment from 'moment'
// import { mapState } from 'vuex'

// const selectArr = ['TYPE0126', 'TYPE0075', 'TYPE0125', 'TYPE0072']
export default {
  data () {
    return {
      fileList: [],
      uploading: false
    }
  },
  created () {
  },
  methods: {
    handleRemove (file) {
      const index = this.fileList.indexOf(file)
      const newFileList = this.fileList.slice()
      newFileList.splice(index, 1)
      this.fileList = newFileList
    },
    beforeUpload (file) {
      this.fileList = [...this.fileList, file]
      this.fileList = this.fileList.slice(-1);
      return false
    },
    // 导入
    handleImport () {
      const { fileList } = this
      const formData = new FormData()
      fileList.forEach((file) => {
        formData.append('file', file)
      })
      this.uploading = true
       this.$upload('admissions/bsksbmxx/upload',formData).then( res => {
        this.uploading = false
        this.$message.success('导入成功')
      })
      console.log('开始导入')
    },
    // 下载模版
    handleDownLoad () {
      console.log('下载模版')
      this.$export('admissions/bsksbmxx/download')
    }
  }
}
</script>
